<script type="text/html" template lay-done="layui.data.sendParams(d.params)"></script>
<div class="layui-card layadmin-header">
    <div class="layui-breadcrumb" lay-filter="breadcrumb">
        <a><cite>接口管理</cite></a>
        <a><cite>接口授权管理</cite></a>
    </div>
</div>

<div class="layui-fluid">
    <div class="layui-row layui-col-space12">
        <div class="layui-col-md5"
             style="border-right: solid 1px #CCCCCC;">
            <fieldset class="layui-elem-field layui-field-title">
                <script type="text/html" template>
                    <legend><span style="color: #DD691D;">待授权</span>接口</legend>
                </script>
            </fieldset>
            <div class="layui-card">
                <div class="layui-form layui-card-header layuiadmin-card-header-auto"
                     lay-filter="content-pdr-api">
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <div class="layui-input-inline">
                                <select name="pdrProjectId" id="pdrProjectIdList" class="layui-form-select">
                                    <option value="">服务项目</option>
                                </select>
                            </div>
                        </div>
                        <div class="layui-inline">
                            <div class="layui-input-inline">
                                <input type="text" name="name" placeholder="接口名称" autocomplete="off"
                                       class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <div class="layui-input-inline">
                                <input type="text" name="code" placeholder="接口编码" autocomplete="off"
                                       class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <div class="layui-input-inline">
                                <input type="text" name="path" placeholder="接口路径" autocomplete="off"
                                       class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <button class="layui-btn LAY-pdr-api-search" lay-submit
                                    lay-filter="LAY-pdr-api-search">
                                搜索
                            </button>
                        </div>
                    </div>
                </div>
                <div class="layui-card-body">
                    <div class="lay-batch-grant" style="margin-bottom: 5px;">
                        <button class="layui-btn layui-btn-warm layui-btn-sm" data-events="batchGrant">
                            <i class="layui-icon layui-icon-auz"></i>确认授权
                        </button>
                    </div>
                    <table id="LAY-pdr-api" lay-filter="LAY-pdr-api"></table>
                </div>
            </div>
        </div>
        <div class="layui-col-md7" style="">
            <fieldset class="layui-elem-field layui-field-title">
                <script type="text/html" template>
                    <legend>{{ d.params.name}}（{{ d.params.appKey}}）-<span style="color: #1E9FFF;">授权</span>接口</legend>
                </script>
            </fieldset>
            <div class="layui-card">
                <div class="layui-form layui-card-header layuiadmin-card-header-auto"
                     lay-filter="content-pdr-api">
                    <script type="text/html" template>
                        <input type="hidden" name="csmId" value="{{ d.params.id}}">
                    </script>
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <div class="layui-input-inline">
                                <select name="pdrId" id="pdrIdList" class="layui-form-select">
                                    <option value="">服务项目</option>
                                </select>
                            </div>
                        </div>
                        <div class="layui-inline">
                            <div class="layui-input-inline">
                                <input type="text" name="pdrApiCode" placeholder="接口编码" autocomplete="off"
                                       class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <button class="layui-btn LAY-pdr-api-grant-search" lay-submit
                                    lay-filter="LAY-pdr-api-grant-search">
                                搜索
                            </button>
                        </div>
                    </div>
                </div>
                <div class="layui-card-body">
                    <script type="text/html" id="table-had-grant">
                        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="unGrant">
                            <i class="layui-icon layui-icon-delete"></i>取消
                        </a>
                        <a class="layui-btn layui-btn-warm layui-btn-xs" lay-event="publish">
                            <i class="layui-icon layui-icon-release"></i>发布
                        </a>
                    </script>
                    <script type="text/html" id="publishStatusTpl">
                        {{#  if(d.publishTime == 0){ }}
                        <span style="color: #CF1900;">未发布</span>
                        {{#  } else{ }}
                        <span style="color: #1E9FFF;">已发布</span>
                        {{#  } }}
                    </script>
                    <table id="LAY-pdr-api-grant" lay-filter="LAY-pdr-api-grant"></table>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
    layui.data.sendParams = function (params) {
        layui.use(['admin', 'table', 'form', 'setter', 'element'], function () {
            var $ = layui.$
                , admin = layui.admin
                , view = layui.view
                , table = layui.table
                , form = layui.form
                , element = layui.element
                , setter = layui.setter;

            var apiUrl = setter.apiUrl;
            admin.req({
                url: apiUrl + '/mapi/producer/drop/list'
                , method: 'post'
                , data: {}
                , done: function (response) {
                    if (response.code === 0) {
                        let dropList = response.data;
                        for (let i = 0; i < dropList.length; i++) {
                            let item = dropList[i];
                            let html = "<option value='" + item.id + "'>" + item.name + "</option>";
                            $('#pdrIdList').append(html);
                            $('#pdrProjectIdList').append(html);
                        }
                        form.render('select');
                    } else {
                        layer.msg(response.msg, {
                            offset: '15px', icon: 2
                        });
                    }
                }
            });

            //监听搜索
            form.on('submit(LAY-pdr-api-search)', function (data) {
                var field = data.field;
                //执行重载
                table.reload('LAY-pdr-api', {
                    where: field
                });
            });

            //监听搜索
            form.on('submit(LAY-pdr-api-grant-search)', function (data) {
                var field = data.field;
                //执行重载
                table.reload('LAY-pdr-api-grant', {
                    where: field
                });
            });

            table.render({
                elem: '#LAY-pdr-api'
                , url: apiUrl + '/mapi/interface/no/grant/list'
                , where: {csmId: params.id}
                , method: 'post'
                , page: true
                , contentType: 'application/json'
                , headers: {'token': layui.data(setter.tableName).token}
                , request: {
                    pageName: 'pageNo'
                    , limitName: 'pageSize'
                }
                , response: {
                    statusCode: 0,
                }
                , parseData: function (res) {
                    if (res.code === 0) {
                        return {
                            "code": res.code,
                            "msg": res.msg,
                            "count": res.data.total,
                            "data": res.data.list
                        };
                    } else {
                        return {
                            "code": res.code,
                            "msg": res.msg,
                        };
                    }
                }
                , cols: [[
                    {type: 'checkbox', fixed: 'left'}
                    , {field: 'name', width: 120, title: '名称'}
                    , {field: 'code', minWidth: 150, title: '编码'}
                    , {field: 'path', width: 150, title: '路径'}
                ]]
                , text: {
                    none: '未检索到数据'
                }
                , done: function () {
                }
            });

            table.render({
                elem: '#LAY-pdr-api-grant'
                , url: apiUrl + '/mapi/interface/grant/list'
                , where: {csmId: params.id}
                , method: 'post'
                , page: true
                , contentType: 'application/json'
                , headers: {'token': layui.data(setter.tableName).token}
                , request: {
                    pageName: 'pageNo'
                    , limitName: 'pageSize'
                }
                , response: {
                    statusCode: 0,
                }
                , parseData: function (res) {
                    if (res.code === 0) {
                        return {
                            "code": res.code,
                            "msg": res.msg,
                            "count": res.data.total,
                            "data": res.data.list
                        };
                    } else {
                        return {
                            "code": res.code,
                            "msg": res.msg,
                        };
                    }
                }
                , cols: [[
                    {field: 'name', width: 120, title: '名称', templet: '<div>{{d.pdrApi.name}}</div>'}
                    , {field: 'pdrApiCode', minWidth: 120, title: '编码'}
                    , {field: 'queryType', width: 70, title: '类型', templet: '<div>{{d.pdrApi.queryType}}</div>'}
                    , {field: 'enable', width: 60, title: '状态', templet: '<div>{{d.enable==0?"禁用":"正常"}}</div>'}
                    , {
                        field: 'publishStatus',
                        title: '发布状态',
                        width: 90,
                        templet: '#publishStatusTpl'
                    }
                    , {title: '操作', minWidth: 120, fixed: 'right', toolbar: '#table-had-grant'}
                ]]
                , text: {
                    none: '未检索到数据'
                }
                , done: function () {
                }
            });

            table.on('tool(LAY-pdr-api-grant)', function (obj) {
                var data = obj.data;
                if (obj.event === 'unGrant') {
                    top.layer.confirm('确定要取消接口授权吗？', {
                        skin: 'layui-layer-admin'
                    }, function (index) {
                        top.layer.close(index);
                        admin.req({
                            url: apiUrl + '/mapi/consumer/un/grant/' + data.id
                            , method: 'get'
                            , done: function (response) {
                                if (response.code === 0) {
                                    layer.msg('取消授权成功', {
                                        offset: '15px', icon: 1, time: 1000
                                    });
                                    layui.table.reload('LAY-pdr-api');
                                    layui.table.reload('LAY-pdr-api-grant');
                                } else {
                                    layer.msg(response.msg, {
                                        offset: '15px', icon: 2
                                    });
                                }
                            }
                        });
                    });
                } else if (obj.event === 'publish') {
                    top.layer.confirm('确定要发布授权吗？', {
                        skin: 'layui-layer-admin'
                    }, function (index) {
                        top.layer.close(index);
                        admin.req({
                            url: apiUrl + '/mapi/consumer/grant/publish/' + data.id
                            , method: 'get'
                            , done: function (response) {
                                if (response.code === 0) {
                                    layer.msg('授权发布成功', {
                                        offset: '15px', icon: 1, time: 1000
                                    });
                                    layui.table.reload('LAY-pdr-api-grant');
                                } else {
                                    layer.msg(response.msg, {
                                        offset: '15px', icon: 2
                                    });
                                }
                            }
                        });
                    });
                }
            })

            var events = {
                batchGrant: function () {
                    var checkStatus = table.checkStatus('LAY-pdr-api')
                        , data = checkStatus.data;
                    if (data.length === 0) return layer.msg('请先选择要授权的接口');
                    var ids = [];
                    for (var i = 0; i < data.length; i++) {
                        ids.push(data[i].id);
                    }
                    let postData = {csmId: params.id, apiIdList: ids};
                    top.layer.confirm('确定要批量授权接口吗？', {
                        skin: 'layui-layer-admin'
                    }, function (index) {
                        top.layer.close(index);
                        admin.req({
                            url: apiUrl + '/mapi/consumer/grant'
                            , method: 'post'
                            , data: JSON.stringify(postData)
                            , done: function (response) {
                                if (response.code === 0) {
                                    layer.msg('授权成功', {
                                        offset: '15px', icon: 1, time: 1000
                                    });
                                    layui.table.reload('LAY-pdr-api');
                                    layui.table.reload('LAY-pdr-api-grant');
                                } else {
                                    layer.msg(response.msg, {
                                        offset: '15px', icon: 2
                                    });
                                }
                            }
                        });
                    });
                }
            };

            $('.lay-batch-grant .layui-btn').on('click', function () {
                var thisEvent = $(this).data('events');
                events[thisEvent] && events[thisEvent].call(this);
            });

        });
    }
</script>